import React, { useRef, useState } from 'react';
import { axconst } from '@/shared/axconst';
import AxColumnAction from '@/components/AxList/AxColumnAction';
import { AxStandardCardButtonType, AxStandardCardFilterType } from '@/components/AxList/AxStandardLayout/data.d';
import { AxStandardWideList } from '@/components/AxList/AxStandardWideList';
import Material from './components/material';
import Search from './components/search';
import { AxColumnEnum } from '@/components/AxList';
import { axurl } from '@/shared/axurl';
import { axhttp } from '@/shared/axhttp';
import { message } from '_antd@3.26.20@antd';

const url = axurl.store.order.tobereceived;
const { postFormX } = axhttp;
const Purchase: React.FC<any> = props => {
    const [expandedRowKeys, setExpandedRowKeys] = useState(['1']);
    const ref = useRef<any>({});

    /** 配置列 */
    const columns: any[] = [
        {
            title: '订单编号',
            dataIndex: 'orderId',
            width: axconst.width.orderId,
        },
        {
            title: '订单标题',
            dataIndex: 'title',
            width: axconst.width.orderTitle,
        },
        {
            title: '数量',
            dataIndex: 'amount',
            width: axconst.width.fouronly,
        },
        {
            title: '订单总额',
            dataIndex: 'sumMoney',
            width: axconst.width.fouronly,
        },
        {
            title: '联系人',
            dataIndex: 'linkManName',
            width: axconst.width.threeonly,
        },
        {
            title: '联系电话',
            dataIndex: 'linkPhone',
            width: axconst.width.phone,
        },
        {
            title: '收货地址',
            dataIndex: 'address',
            width: axconst.width.address,
        },
        {
            title: '下单时间',
            dataIndex: 'created',
            width: axconst.width.time,
        },
        {
            title: '订单状态',
            dataIndex: 'orderStatus',
            width: axconst.width.fouronly,
            render: (val: any) => AxColumnEnum({ enumName: 'orderStatus', value: val }),
        },
        {
            title: '操作',
            fixed: 'right',
            width: axconst.width.operate4,
            render: (value: any, record: any) => {
                return (
                    <AxColumnAction
                        buttons={[
                            {
                                text: '确认送达',
                                popconfirm: true,
                                onClick: () => handleArrived(record.orderId),
                            },
                        ]}
                    />
                )
            },
        },
    ];

    const handleExpandedRowsChange = (expandedRows: any) => {
        setExpandedRowKeys(expandedRows);
    };

    /** 配置操作按钮 */
    const button: AxStandardCardButtonType[] = [];

    const filter: AxStandardCardFilterType[] = []

    /** 确认送达 */
    const handleArrived = (orderId: any) => {
        postFormX(url.updateArrived, null, {
            orderId,
        }).then(() => {
            message.success('确认送达成功');
            ref.current.handleRefresh();
        })
    }

    return (
        <>
            <AxStandardWideList
                ref={ref}
                url={url}
                columns={columns}
                button={button}
                filter={filter}
                checkboxModel={false}
                AdvancedSearch={Search}
                expandedRowKeys={expandedRowKeys}
                onExpandedRowsChange={handleExpandedRowsChange}
                expandedRowRender={(record: any) => (
                    <Material orderId={record.orderId} />
                )}
            />
        </>
    );
};

export default Purchase;